.loveRoad {
  background: url("../../images/loveRoadBg.png") repeat-y center;
  padding-bottom: 100px;
  background-size: 100%;
  .head{
    height: 42px;
    background: #1AAC19;
    font-size: 16px;
    text-align: center;
    color: #fff;
    line-height: 42px;
    text-align: center;
    position: relative;
    .head-icon{
      font-size: 20px;
      position: absolute;
      left:15px;
    }
  }
  .NewYear {
    position: relative;
    .NewYearimagesBox {
      width: 100%;
      img {
        width: 100%;
      }
    }
    .NewYearTextBox {
      width: 80%;
      margin: 0 auto;
      //background: red;
      position: absolute;
      bottom: 13%;
      left: 10%;
      text-align: center;
      .textTitle {
        font-size: 20px;
        font-weight: bold;
        margin-bottom: 10px;
      }
      .textCon {
        text-align: left;
        font-size: 17px;
        font-weight: bold;
        line-height: 30px;
        text-indent: 20px;
        .textCon_num {
          font-size: 20px;
          color: #e40100;
        }
      }
    }
  }
  .content {
    .content_avatar {
      .avatar_box {
        width: 80px;
        height: 80px;
        border-radius: 50%;
        overflow: hidden;
        margin: 50px auto 10px;
        padding: 2px;
        border:2px solid #01b2f8;
        img {
          width: 100%;
          height: 100%;
          border-radius: 50%;
        }
      }
      .avatar_name {
        font-size: 20px;
      }
    }
    .content_number {
      margin-top: 50px;
      .number_box_box {
        width: 220px;
        height: 220px;
        border: 2px solid transparent;
        background-clip:padding-box,border-box;
        background-origin:padding-box,border-box;
        background-image:linear-gradient(45deg,#fff,#fff),linear-gradient(90deg,#009ff5,#005bea);
        border-radius: 50%;
        margin: 0px auto;
        position: relative;
        .number_box_xuanzhuna {
          position: absolute;
          left: 8px;
          top: 0px;
          width: 200px;
          height: 200px;
          border: 2px dotted red;
          border-top-color: #00a0f5;
          border-right-color: #005bea;
          border-left-color: #009ff5;
          border-bottom-color: #005bea;
          border-radius: 50%;
          margin: 8px auto;
          //transition: All 10s ease-in-out;
          //animation: rotate 10s linear infinite;
          //@keyframes rotate{
          //  from{transform: rotate(360deg)}
          //  to{transform: rotate(0deg)}
          //}
        }
        .number_box {
          width: 200px;
          height: 200px;
          //border: 2px dotted red;
          //border-top-color: #00a0f5;
          //border-right-color: #005bea;
          //border-left-color: #009ff5;
          //border-bottom-color: #005bea;
          border-radius: 50%;
          margin: 8px auto;
          .number_box_iconJb {
            width: 40px;
            height: 50px;
            margin: 10px auto 0;
            img {
              width: 100%;
              height: 100%;
            }
          }
          .number_box_text {
            font-size: 15px;
            color: #005bea;
            font-weight: bold;
            font-family: 'Source Sans Pro', Helvetica, Arial, sans-serif;
            line-height: 34px;
            .number_box_text_big {
              font-size: 26px;
            }
          }
        }
      }
    }
    .myLoveRoadBtn {
      width: 70%;
      height: 46px;
      border:2px solid #1AAC19;
      color: #1AAC19;
      margin: 40px auto 0;
      font-weight: bold;
      line-height: 46px;
      text-align: center;
      font-size: 16px;
    }
    .firstIconBox {
      width: 310px;
      margin: 40px auto 0;
      .firstIconBox_iamgeBox {
        width: 300px;
        position: relative;
        img {
          width: 100%;
        }
        .firstIconBox_iamgeBox_textFirst {
          background-color: transparent;
          width: 200px;
          height: 40px;
          position: absolute;
          top: 0px;
          right: -20px;
          text-align: left;
          .firstIconBox_iamgeBox_textFirst_p1 {
            line-height: 38px;
            font-size: 31px;
          }
          .firstIconBox_iamgeBox_textFirst_p2 {
            font-size: 18px;
          }
        }
        .textSecond {
          top: 0px;
          left: 18px;
        }
        .textThree{
          top: 22px;
        }
        .textFouth {
          top: 16px;
          left: 90px;
        }
      }
    }
    .content_project {
      width: 300px;
      margin: 0 auto;
      .content_projectTitle_text {
        color: #1AAC19;
        font-size: 14px;
        text-align: center;
      }
      .content_project_content {
        margin-top: 10px;
        .content_project_content_top {
          box-shadow: 0 0 4px #999999;
          padding: 10px;
          background-color: transparent;
          border-radius: 4px;
          .content_project_content_top_title {
            font-size: 16px;
            color: #666666;
          }
          .content_project_content_top_name {
            font-size: 20px;
            color: #333333;
          }
          .content_project_content_top_money {
            font-size: 18px;
            color: #eb7721;
            span {
              font-size: 22px;
              font-weight: bold;
            }
          }
        }
        .content_project_content_bottom {
          box-shadow: 0 0 4px #999999;
          padding: 16px;
          margin-top: 20px;
          background-color: transparent;
          border-radius: 4px;
          .content_project_content_bottom_iamge {
            max-height: 200px;
            border-radius: 4px;
            box-shadow: 0 0 4px #999999;
            overflow: hidden;
            img {
              width: 100%;
              max-height: 200px;
            }
          }
          .content_project_content_bottom_text {
            margin-top: 10px;
            font-size: 16px;
            .bottom_text_title {
              color: #666666;
              text-align: left;
              display: -webkit-box;
              -webkit-box-orient: vertical;
              -webkit-line-clamp: 3;
              overflow: hidden;
            }
            .bottom_text_progressBox {
              display: flex;
              justify-content: space-between;
              align-items: center;
              .progressBox_progress {
                width: 210px;
                height: 7px;
                border: 1px solid #1AAC19;
                border-radius: 10px;
                .progressBox_progress_nei {
                  display: block;
                  width: 10px;
                  height: 7px;
                  background-color: #1AAC19;
                  border-radius: 10px;
                }
              }
            }
            .bottom_text_mubiao {
              margin-top: 10px;
              display: flex;
              justify-content: space-between;
              color: #333333;
              .bottom_text_mubiao_color {
                color: #eb6353;
                font-weight: bold;
              }
            }
          }
        }
      }
    }
    .morejilu {
      width: 300px;
      height: 40px;
      margin: 0 auto;
      line-height: 40px;
      //background-color: #1AAC19;
      //border: 1px solid #cccccc;
      box-shadow: 0 0 4px #999999;
      color: #1AAC19;
      text-align: center;
      font-size: 14px;
      border-radius: 4px;
      margin-top: 20px;
    }
    .content_footer {
      margin-top: 100px;
      .footer_jiangbei {
        width: 80px;
        margin: 0px auto;
        img {
          width: 100%;
        }
      }
      .footer_zhufu {
        color: #e75818;
        font-size: 16px;
        margin-top: 20px;
        text-align: center;
      }
      .footer_btn {
        width: 300px;
        height: 40px;
        margin: 0 auto;
        line-height: 40px;
        background-color: #1AAC19;
        color: #ffffff;
        text-align: center;
        font-size: 14px;
        border-radius: 4px;
        margin-top: 30px;
      }
    }
  }
}
